<template>
    <div>
        <el-form
            :label-position="'left'"
            label-width="100px"
            style="max-width: 460px;margin-top: 50%"
        >
            <el-form-item label="用户名">
                <el-input v-model="form.userName" />
            </el-form-item>
            <el-form-item label="个人简介">
                <el-input v-model="form.userProfile" />
            </el-form-item>
        </el-form>
        <router-view/>
        <el-button @click="toPersonCard"><el-icon><ArrowLeftBold /></el-icon>返回</el-button>
        <el-button @click="commit"><el-icon><Check /></el-icon>确认</el-button>
        <el-button @click="toChangePassWord"><el-icon><Lock /></el-icon>修改密码</el-button>
    </div>

</template>


<script setup>

import {reactive} from 'vue'
import router from "@/router";
import {ElMessage} from "element-plus";
import {postWithToken} from "@/net/postAndGetMethodWithToken";
const toPersonCard =()=>{
    router.push({name:'Person-Card'})
}
const toChangePassWord =()=>{
    router.push(({name:'Change-passWord'}))
}
const form = reactive({
    form: {
        userName:'',
        userProfile:'',
    },
})
const commit =()=>{
    postWithToken('/api/user/updateInfo', JSON.stringify({
        userName: form.userName,
        userProfile: form.userProfile,
        isDelete:1
    }), (data, code, message) => {
        ElMessage.success("修改成功")
        router.push({name: 'Person-Card'})
    }, (data, code, message) => {
        if (code === 40000) {
            ElMessage.warning("修改失败")
        }
    })
}



</script>


<style scoped>


</style>